<template>
  <div class="welding-data scroll-wrap">
    <div class="welding-head">
      <notice />
      <div class="head-center">
        <div class="name">
          <!--          <el-image :src="object.logo|imgPath" style="width:56px;margin-right: 10px; vertical-align: middle;">-->
          <!--            <div slot="error" class="image-slot">-->
          <!--              <i class="el-icon-picture-outline" />-->
          <!--            </div>-->
          <!--          </el-image>-->
          <img :src="object.logo|imgPath" style="width:56px;margin-right: 10px; vertical-align: middle;">
          <!--          <img src="../../assets/img/logo1.png" width="105px" style="margin-right: 10px; vertical-align: middle;">-->
          {{ object.screenName }}
        </div>
      </div>
      <div class="head-right">
        <div class="right-block">
          <div class="user">
            <div class="media">
              <div class="media-left">
                <el-avatar :src="avatar|imgPath" size="medium" />
              </div>
              <div class="media-body">
                <div class="name" style="margin-top: 10px">{{ name }}</div>
                <div class="info">
                  <el-dropdown>
                    <span class="el-dropdown-link name ">
                      <i class="el-icon-arrow-down el-icon--right" />
                    </span>
                    <el-dropdown-menu slot="dropdown">
                      <el-dropdown-item>
                        <span style="display:block;" @click="logout">{{ $t('navbar.logOut') }}</span>
                      </el-dropdown-item>
                    </el-dropdown-menu>
                  </el-dropdown>
                </div>
              </div>
            </div>
          </div>
          <div class="set message" style="height: 40px;line-height: 40px">
            <i class="iconfont icon-tongzhi" />消息
          </div>
          <div class="set" style="height: 40px;line-height: 40px">
            <router-link to="/"><i class="iconfont icon-shezhi" />设置</router-link>
          </div>
        </div>
      </div>
    </div>
    <div class="welding-container clearfix">
      <div class="welding-left">
        <!-- 项目信息 -->
        <project-info :obj="object" />
        <!-- 工艺信息 -->
        <process-information />
        <!-- 生产计划  -->
        <ProductionPlan />
      </div>
      <div class="welding-mid">
        <!-- 视频展示 --->
        <video-show />
        <!-- 轮播 -->
        <mid-block2 @on-data="getMonitoring" />
      </div>
      <div class="welding-right">
        <!-- 时间展示 -->
        <date-show :monitoring-data="monitoringData" />
        <!-- 人员统计 -->
        <personnel-statistics />
        <!--  设备报警  -->
        <equipment-alarm />
        <!-- 巡检数据 -->
        <patrol-data />
      </div>
    </div>
    <!--    <p style="font-size: 14px; color:#fff; height: 20px; text-align: center; padding: 20px">恩科机电设备有限公司版权所有</p>-->
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import VideoShow from './components/VideoShowCS1'
import MidBlock2 from './components/MidBlock2'
import ProductionPlan from './components/ProductionPlan'
import DateShow from './components/DateShow'
import PatrolData from './components/PatrolData'
import EquipmentAlarm from './components/EquipmentAlarm'
import PersonnelStatistics from './components/PersonnelStatistics'
import ProjectInfo from './components/ProjectInfo'
import ProcessInformation from './components/ProcessInformation'
import Notice from './components/notice'
import { postHandle } from '@/api'
export default {
  name: 'ProjectScreen',
  components: { Notice, ProcessInformation, ProjectInfo, PersonnelStatistics, EquipmentAlarm, PatrolData, DateShow, ProductionPlan, MidBlock2, VideoShow },
  data() {
    return {
      monitoringData: {},
      object: {}
    }
  },
  computed: {
    ...mapGetters([
      'avatar',
      'name'
    ])
  },
  created() {
    this.getData(this.$route.query.id)
  },
  methods: {
    async getData(id) {
      await postHandle(`/api/v1/welder-sbtx-second/project-info-comb/show/${id}`).then(res => {
        this.object = res.result
      })
    },
    getMonitoring(obj) {
      this.monitoringData = obj
    },
    getProjectInfo(obj) {
      console.log(obj)
      this.object = obj
    },
    async logout() {
      await this.$store.dispatch('user/logout')
      this.$router.push(`/login`)
    }
  }
}
</script>

<style scoped>

</style>
